/**
 * 为某个元素创建一个tooltips
 * 
 * @author wanggang
 * 
 * @param elem 要创建tooltips的元素
 * @param context; 在tooltips中要显示的内容
 * 
 */
aeroui.tooltips = function(elem , context){
	/*
	 * 修改于2010-05-22 
	 * 修改原因:为了可以适应多种传入参数的方式
	 */
	if( typeof( elem )=='undefined' ){
		window.alert( '没有明确指出要为那个元素设置tooltips' );
		return;
	}
	// 如果传入的是id
	if( typeof( elem )=='string' ){
		this.elem = document.getElementById( elem );
	}
	// 如果传入的是DOM节点
	if( typeof( elem )=='object' ){
		if( typeof(elem.jquery)!='undefined' ){
			this.elem = elem[0];
		}else{
			this.elem = elem;
		}
	}
	this.context = context;
	// 先从dom树中去找tooltips的div是否存在，如果不存在就构建一个，要保证在一个js解析器中只有一个tooltips对象
	this.tooltips = document.getElementById( 'aeroui_tooltips' );
	if( null == this.tooltips ){
		this.tooltips = document.createElement('div');
		this.setToolTipsCss( 'aeroui_tooltips' );
		$( this.tooltips ).attr('id' ,  'aeroui_tooltips' );
		// 把tooltips对象添加到body
		$( document.body ).append( this.tooltips );
	}
	
	// 建立dom对象与js对象的关联
	this.elem.tips = this.tooltips;
	// 建立dom对象与js对象的关联
	this.elem.msg = this.context;
	// 要生成tooltips的元素的样式
	$( this.elem ).addClass( 'aeroui_tooltips_host' );
	this.elem.borderColor = $( this.elem ).css( 'borderColor');
	this.elem.borderWidth = $( this.elem ).css( 'borderWidth');
	$( this.elem ).css( 'borderColor' , 'red' );
	$( this.elem ).css( 'borderWidth' , '3px' );
	// 为此元素bind一个mouseover事件与mouseout事件与mousemove事件
	$( this.elem ).bind('mouseover' , this.tooltipsMouseover);
	$( this.elem ).bind('mouseout' , this.tooltipsMouseout);
	$( this.elem ).bind('mousemove' , this.tooltipsMousemove);
	$( this.elem ).bind('click' , this.tooltipsClick);
	// 让产生tooltips的元素可以调用release方法
	this.elem.release = this.release;
};
/**
 * 解除DOM对象与JS对象之间关联,回收整个tooltips占用的内存
 * 此方法供被生成tooltips的DOM对象调用所以方法中的this是指DOM元素，是不是指aeroui.tooltips
 * elem.release()就可以回收内存
 */
aeroui.tooltips.prototype.release = function(){
	// 此方法中的this不再是aeroui.tooltips对象，而是DOM对象
	// 去除css样式
	$( this ).removeClass( 'aeroui_tooltips_host' );
	$( this ).css({
		borderColor : '',
		borderWidth : ''
	});
	// 解除关联
	this.tips = null;
	this.msg = null;
	// 解除事件 
	$( this ).unbind( 'mouseover' , this.tooltipsMouseover);
	$( this ).unbind( 'mouseout' , this.tooltipsMouseout);
	$( this ).unbind( 'mousemove' , this.tooltipsMousemove);
	$( this ).unbind( 'click' , this.tooltipsClick);
	this.release = null;
}
/**
 * 元素的click事件中，把tooltips消失
 */
aeroui.tooltips.prototype.tooltipsClick = function( event ){
	var tips = this.tips;
	$( this.tips ).css( {
		display : 'none'
	} );
}
/**
 * 元素的mousemove事件 ，使tooltips位置发生改变
 */
aeroui.tooltips.prototype.tooltipsMousemove = function( event ){
	var tips = this.tips;
	var xy = _getMousePosition( event );
	
	//tips信息
	var tipWidth=$( this.tips ).width();
	var tipHeight=$( this.tips ).height();


	//可见区域
	var viewWidth=document.body.offsetWidth;
	var viewHeight=document.body.offsetHeight;
	
	//鼠标坐标
	var mouseX=xy.x;
	var mouseY=xy.y;
	
	//根据可见区域初始化鼠标坐标
	if(mouseX >= viewWidth-150 || mouseY >= viewHeight-150)
	{
		mouseX=xy.x - tipWidth ;
		mouseY=xy.y - tipHeight ;
	}
	
	$( this.tips ).css( {
		left : ( mouseX + 20 ) + 'px',
		top : ( mouseY + 10 ) + 'px'
	} );
	
}
/**
 * 元素的mouseover事件 ，使tooltips显示
 */
aeroui.tooltips.prototype.tooltipsMouseover = function( event ){
	var tips = this.tips;
	var msg = this.msg;
	$( this.tips ).html( msg );
	// 使div在以显示
	$( this.tips ).bgiframe();
	$( this.tips ).css( {
		display : 'block'
	} );
}
/**
 * 元素的mouseout事件，使用tooltips消失
 */
aeroui.tooltips.prototype.tooltipsMouseout = function( event ){
	var tips = this.tips;
	$( this.tips ).css( {
		display : 'none'
		/*
		 * 修改于2010-05-22
		 * 修改原因:当mouse不灵敏时，tooltips可能会在屏幕的左上角显示一下再消失
		 */
		/*left : '0px',
		top : '0px'*/
	} );
}
/**
 * 要创建tooltips的元素的样式
 * @param elemCss 要创建tooltips的元素的样式
 */
aeroui.tooltips.prototype.setElemCss = function( elemCss ){
	$( this.elem ).addClass( elemCss );
}
/**
 * tooltips的样式
 * @param tooltipsCss 是tooltips的样式
 */
aeroui.tooltips.prototype.setToolTipsCss = function( tooltipsCss ){
	$( this.tooltips ).addClass( tooltipsCss );
}
/**
 * 向tooltips中添加要显示的内容
 * @param context 要添加的内容
 * 
 */
aeroui.tooltips.prototype.setToolTipsContext = function( context ){
	$( this.tooltips ).html( context );
}
